import React from "react";
export default class App extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            arr: []
        }
    }
    componentDidMount() {
        this.$axios
            .get(
                "https://apipc-xiaotuxian-front.itheima.net/home/new"
            )
            .then(res => {
                // console.log(res);
                if (res.data.msg == '操作成功') {
                    this.setState({
                        arr: res.data.result
                    });
                }

            });
    }
    render() {
        return <div>
            <div className="home-new" data-v-23d30092="">
                <div className="home-panel" data-v-39dda62a="" data-v-23d30092="">
                    <div className="container" data-v-39dda62a="">
                        <div className="head" data-v-39dda62a="">
                            <h3 data-v-39dda62a="">
                                新鲜好物<small data-v-39dda62a="">新鲜出炉 品质靠谱</small>
                            </h3>
                            <a aria-current="page"
                                href="#"
                                className="router-link-active router-link-exact-active xtx-more"
                                data-v-d6f2c104=""
                                data-v-23d30092="">
                            <span data-v-d6f2c104="">查看全部</span>
                            <i className="iconfont icon-angle-right" data-v-d6f2c104=""></i></a>
                        </div>
                        <div data-v-23d30092="">
                            <ul className="goods-list" data-v-23d30092="">
                                {this.state.arr.map((i, index) => {
                                    return <li data-v-23d30092="" key={index}>
                                        <a href="#" data-v-23d30092=""
                                        ><img src={i.picture} alt="" data-v-23d30092="" />
                                            <p className="name ellipsis" data-v-23d30092="">
                                                {i.name}
                                            </p>
                                            <p className="price" data-v-23d30092="">¥{i.price}</p></a>
                                    </li>
                                })}


                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    }
}